<!DOCTYPE html>
<html>

<head>
  <title>主页</title>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <meta name="referrer" content="no-referrer">
  <link href="https://cdn.staticfile.org/twitter-bootstrap/5.1.1/css/bootstrap.min.css" rel="stylesheet">
  <link rel="icon" href="../logo1.ico">
  <link rel="stylesheet" href="../css/swiper-bundle.min.css">
  <script src="../js/ajax.js"></script>
  <script src="https://cdn.staticfile.org/twitter-bootstrap/5.1.1/js/bootstrap.bundle.min.js"></script>
  <script src="../js/checkLogin.js"></script>

  <style>
    .col:hover {
      color: orange;
      text-decoration-line: underline;
    }

    .col {
      cursor: pointer;
    }

    .swiper {
      width: 220px;
      height: 264px;
      overflow: visible;
    }

    .swiper-slide img {
      width: 100%;
      height: 100%;
    }

    body {
      min-height: 100vh;
      min-height: -webkit-fill-available
    }

    html {
      height: -webkit-fill-available
    }

    main {
      display: flex;
      flex-wrap: nowrap;
      height: 100vh;
      height: -webkit-fill-available;
      max-height: 100vh;
      overflow-x: auto;
      overflow-y: hidden
    }

    .b-example-divider {
      flex-shrink: 0;
      width: 1.5rem;
      height: 100vh;
      background-color: rgba(0, 0, 0, .1);
      border: solid rgba(0, 0, 0, .15);
      border-width: 1px 0;
      box-shadow: inset 0 .5em 1.5em rgba(0, 0, 0, .1), inset 0 .125em .5em rgba(0, 0, 0, .15)
    }

    .bi {
      vertical-align: -.125em;
      pointer-events: none;
      fill: currentColor
    }

    .dropdown-toggle {
      outline: 0
    }

    .nav-flush .nav-link {
      border-radius: 0
    }

    .btn-toggle {
      display: inline-flex;
      align-items: center;
      padding: .25rem .5rem;
      font-weight: 600;
      color: rgba(0, 0, 0, .65);
      background-color: transparent;
      border: 0
    }

    .btn-toggle:hover,
    .btn-toggle:focus {
      color: rgba(0, 0, 0, .85);
      background-color: #d2f4ea
    }

    .btn-toggle::before {
      width: 1.25em;
      line-height: 0;
      content: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='rgba%280,0,0,.5%29' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M5 14l6-6-6-6'/%3e%3c/svg%3e");
      transition: transform .35s ease;
      transform-origin: .5em 50%
    }

    .btn-toggle[aria-expanded="true"] {
      color: rgba(0, 0, 0, .85)
    }

    .btn-toggle[aria-expanded="true"]::before {
      transform: rotate(90deg)
    }

    .btn-toggle-nav a {
      display: inline-flex;
      padding: .1875rem .5rem;
      margin-top: .125rem;
      margin-left: 1.25rem;
      text-decoration: none
    }

    .btn-toggle-nav a:hover,
    .btn-toggle-nav a:focus {
      background-color: #d2f4ea
    }

    .scrollarea {
      overflow-y: auto
    }

    .fw-semibold {
      font-weight: 600
    }

    .lh-tight {
      line-height: 1.25
    }

    .bd-placeholder-img {
      font-size: 1.125rem;
      text-anchor: middle;
      -webkit-user-select: none;
      -moz-user-select: none;
      user-select: none
    }

    @media (min-width:768px) {
      .bd-placeholder-img-lg {
        font-size: 3.5rem
      }
    }

    .list ul li {
      list-style: none;
      padding-left: 21px;
      padding-right: 21px;
      cursor: pointer;
    }

    .list ul li.active {
      color: orange;
      /* text-decoration-line: underline; */
      border-bottom: 2px solid orange;
    }

    ol li {
      list-style: none;
      margin-bottom: 10px;
      cursor: pointer;
    }

    ol li span:hover {
      color: orange;
    }

    .left ul li {
      list-style: none;
    }

    .left ul li img {
      display: block;
      width: 200px;
    }

    .left ul li p {
      margin-bottom: 1px;
      margin-left: -28px;
    }

    .swiper-button-prev {
      left: -360px
    }

    .swiper-button-next {
      right: -300px
    }

    .imgInfo {
      display: none;
      z-index: 100;
      position: absolute;
      box-shadow: 0 15px 30px rgba(0, 0, 0, 0.1);
      top: -297px;
      left: 33px;
    }

    .bottom li a {
      text-decoration: none;
      color: black;
    }

    .a1 {
      position: relative;
    }

    .a1:hover .imgInfo {
      display: block;
    }

    .a1:hover .i1 {
      opacity: 0;
    }

    .left ol {
      width: 100%;
      height: 287px;
      margin-top: 10px;
      margin-left: -60px;
      padding-right: 32px;
      overflow: hidden;
    }

    .left ol li ul {
      float: left;
      margin-left: 39px;
      height: 287px;
    }

    .left ol .li1 {
      display: none;
    }

    .left ol .li1.active {
      height: 287px;
      display: block;
    }
    #history{
      cursor: pointer;
    }
    #hide{
      width: 220px;
      height: 0;
      line-height: 140px;
      position: absolute;
      top: 50px;
      right: 156px;
      z-index: 100;
      overflow: hidden;
      text-align: center;
      transition: all .3s;
      box-shadow: 0 2px 10px rgba(0,0,0,.15)
    }
    #history:hover #hide{
      height: 140px;
      color: #000;
    }
    #history:hover{
      color:orange
    }
    .col-4 ul li{
      list-style: none;
      flex: 1;
      cursor: pointer;
    }
    .col-4 ul li:hover{
      color: orange;
    }
  </style>
</head>

<body>
  <main>
    <div class="d-flex flex-column flex-shrink-0 p-3 text-white bg-dark"
      style="width: 280px;background: rgba(0,0,0,.5)!important">
      <a class="d-flex align-items-center mb-3 mb-md-0 me-md-auto text-white text-decoration-none">
        <svg class="bi me-2" width="40" height="32">
          <use xlink:href="#bootstrap" />
        </svg>
        <span class="fs-4"
          style="width: 70px;height: 70px;border: 1px solid;margin-left: 34px;background-color: #fff;border-radius: 50%;"><img
            src="../img/1.jpg" alt=""
            style="width: 62px;height:62px;border-radius: 50%;margin-top: 3px;margin-left: 3px;" id="smAvatar"></span>
      </a>
      <div style="margin-left: 68px;margin-top: 10px;">欢迎您, <span style="color: #fdff00" id="user">文渊</span></div>
      <div
        style="width: 240px;height:50px;background-color: #636464;border-radius: 10px;margin-top: 10px;text-indent: 2em;" id="text"></div>
      <hr>
      <ul class="nav nav-pills flex-column mb-auto">
        <li class="nav-item">
          <a href="./home.html" class="nav-link active" aria-current="page" style="background-color: #adb5bd;">
            <svg class="bi me-2" width="16" height="16">
              <use xlink:href="#home" />
            </svg>
            <svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" fill="currentColor"
              class="bi bi-house-door-fill" viewBox="0 0 16 16">
              <path
                d="M6.5 14.5v-3.505c0-.245.25-.495.5-.495h2c.25 0 .5.25.5.5v3.5a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5v-7a.5.5 0 0 0-.146-.354L13 5.793V2.5a.5.5 0 0 0-.5-.5h-1a.5.5 0 0 0-.5.5v1.293L8.354 1.146a.5.5 0 0 0-.708 0l-6 6A.5.5 0 0 0 1.5 7.5v7a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5z" />
            </svg> 主页
          </a>
        </li>
        <li>
          <a href="./type.html" class="nav-link text-white">
            <svg class="bi me-2" width="16" height="16">
              <use xlink:href="#speedometer2" />
            </svg>
            <svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" fill="currentColor" class="bi bi-list-ul"
              viewBox="0 0 16 16">
              <path fill-rule="evenodd"
                d="M5 11.5a.5.5 0 0 1 .5-.5h9a.5.5 0 0 1 0 1h-9a.5.5 0 0 1-.5-.5zm0-4a.5.5 0 0 1 .5-.5h9a.5.5 0 0 1 0 1h-9a.5.5 0 0 1-.5-.5zm0-4a.5.5 0 0 1 .5-.5h9a.5.5 0 0 1 0 1h-9a.5.5 0 0 1-.5-.5zm-3 1a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm0 4a1 1 0 1 0 0-2 1 1 0 0 0 0 2zm0 4a1 1 0 1 0 0-2 1 1 0 0 0 0 2z" />
            </svg> 类型管理
          </a>
        </li>
        <li>
          <a href="./movie.html" class="nav-link text-white">
            <svg class="bi me-2" width="16" height="16">
              <use xlink:href="#table" />
            </svg>
            <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-film"
              viewBox="0 0 16 16">
              <path
                d="M0 1a1 1 0 0 1 1-1h14a1 1 0 0 1 1 1v14a1 1 0 0 1-1 1H1a1 1 0 0 1-1-1V1zm4 0v6h8V1H4zm8 8H4v6h8V9zM1 1v2h2V1H1zm2 3H1v2h2V4zM1 7v2h2V7H1zm2 3H1v2h2v-2zm-2 3v2h2v-2H1zM15 1h-2v2h2V1zm-2 3v2h2V4h-2zm2 3h-2v2h2V7zm-2 3v2h2v-2h-2zm2 3h-2v2h2v-2z" />
            </svg> 影片管理
          </a>
        </li>
        <li>
          <a href="./user.html" class="nav-link text-white">
            <svg class="bi me-2" width="16" height="16">
              <use xlink:href="#grid" />
            </svg>
            <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-people-fill"
              viewBox="0 0 16 16">
              <path d="M7 14s-1 0-1-1 1-4 5-4 5 3 5 4-1 1-1 1H7zm4-6a3 3 0 1 0 0-6 3 3 0 0 0 0 6z" />
              <path fill-rule="evenodd"
                d="M5.216 14A2.238 2.238 0 0 1 5 13c0-1.355.68-2.75 1.936-3.72A6.325 6.325 0 0 0 5 9c-4 0-5 3-5 4s1 1 1 1h4.216z" />
              <path d="M4.5 8a2.5 2.5 0 1 0 0-5 2.5 2.5 0 0 0 0 5z" />
            </svg> 用户管理
          </a>
        </li>
        <li>
          <a href="./count.html" class="nav-link text-white">
            <svg class="bi me-2" width="16" height="16">
              <use xlink:href="#people-circle" />
            </svg>
            <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-card-list"
              viewBox="0 0 16 16">
              <path
                d="M14.5 3a.5.5 0 0 1 .5.5v9a.5.5 0 0 1-.5.5h-13a.5.5 0 0 1-.5-.5v-9a.5.5 0 0 1 .5-.5h13zm-13-1A1.5 1.5 0 0 0 0 3.5v9A1.5 1.5 0 0 0 1.5 14h13a1.5 1.5 0 0 0 1.5-1.5v-9A1.5 1.5 0 0 0 14.5 2h-13z" />
              <path
                d="M5 8a.5.5 0 0 1 .5-.5h7a.5.5 0 0 1 0 1h-7A.5.5 0 0 1 5 8zm0-2.5a.5.5 0 0 1 .5-.5h7a.5.5 0 0 1 0 1h-7a.5.5 0 0 1-.5-.5zm0 5a.5.5 0 0 1 .5-.5h7a.5.5 0 0 1 0 1h-7a.5.5 0 0 1-.5-.5zm-1-5a.5.5 0 1 1-1 0 .5.5 0 0 1 1 0zM4 8a.5.5 0 1 1-1 0 .5.5 0 0 1 1 0zm0 2.5a.5.5 0 1 1-1 0 .5.5 0 0 1 1 0z" />
            </svg> 统计信息
          </a>
        </li>
        <li>
          <a href="./comments.html" class="nav-link text-white">
            <svg class="bi me-2" width="16" height="16">
              <use xlink:href="#people-circle" />
            </svg>
            <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor"
              class="bi bi-chat-left-dots" viewBox="0 0 16 16">
              <path
                d="M14 1a1 1 0 0 1 1 1v8a1 1 0 0 1-1 1H4.414A2 2 0 0 0 3 11.586l-2 2V2a1 1 0 0 1 1-1h12zM2 0a2 2 0 0 0-2 2v12.793a.5.5 0 0 0 .854.353l2.853-2.853A1 1 0 0 1 4.414 12H14a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2H2z" />
              <path
                d="M5 6a1 1 0 1 1-2 0 1 1 0 0 1 2 0zm4 0a1 1 0 1 1-2 0 1 1 0 0 1 2 0zm4 0a1 1 0 1 1-2 0 1 1 0 0 1 2 0z" />
            </svg> 评论管理
          </a>
        </li>
        <li>
          <a href="./update.html" class="nav-link text-white">
            <svg class="bi me-2" width="16" height="16">
              <use xlink:href="#people-circle" />
            </svg>
            <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-gear"
              viewBox="0 0 16 16">
              <path
                d="M8 4.754a3.246 3.246 0 1 0 0 6.492 3.246 3.246 0 0 0 0-6.492zM5.754 8a2.246 2.246 0 1 1 4.492 0 2.246 2.246 0 0 1-4.492 0z" />
              <path
                d="M9.796 1.343c-.527-1.79-3.065-1.79-3.592 0l-.094.319a.873.873 0 0 1-1.255.52l-.292-.16c-1.64-.892-3.433.902-2.54 2.541l.159.292a.873.873 0 0 1-.52 1.255l-.319.094c-1.79.527-1.79 3.065 0 3.592l.319.094a.873.873 0 0 1 .52 1.255l-.16.292c-.892 1.64.901 3.434 2.541 2.54l.292-.159a.873.873 0 0 1 1.255.52l.094.319c.527 1.79 3.065 1.79 3.592 0l.094-.319a.873.873 0 0 1 1.255-.52l.292.16c1.64.893 3.434-.902 2.54-2.541l-.159-.292a.873.873 0 0 1 .52-1.255l.319-.094c1.79-.527 1.79-3.065 0-3.592l-.319-.094a.873.873 0 0 1-.52-1.255l.16-.292c.893-1.64-.902-3.433-2.541-2.54l-.292.159a.873.873 0 0 1-1.255-.52l-.094-.319zm-2.633.283c.246-.835 1.428-.835 1.674 0l.094.319a1.873 1.873 0 0 0 2.693 1.115l.291-.16c.764-.415 1.6.42 1.184 1.185l-.159.292a1.873 1.873 0 0 0 1.116 2.692l.318.094c.835.246.835 1.428 0 1.674l-.319.094a1.873 1.873 0 0 0-1.115 2.693l.16.291c.415.764-.42 1.6-1.185 1.184l-.291-.159a1.873 1.873 0 0 0-2.693 1.116l-.094.318c-.246.835-1.428.835-1.674 0l-.094-.319a1.873 1.873 0 0 0-2.692-1.115l-.292.16c-.764.415-1.6-.42-1.184-1.185l.159-.291A1.873 1.873 0 0 0 1.945 8.93l-.319-.094c-.835-.246-.835-1.428 0-1.674l.319-.094A1.873 1.873 0 0 0 3.06 4.377l-.16-.292c-.415-.764.42-1.6 1.185-1.184l.292.159a1.873 1.873 0 0 0 2.692-1.115l.094-.319z" />
            </svg> 修改设置
          </a>
        </li>
      </ul>
    </div>

    <div class="row" style="width: calc(100% - 280px);margin-left:0">
      <div class="row" style="height: 50px;margin-left: 0;line-height: 50px;">
        <div class="col-2"><img src="../img/logo2.jpg"
            style="height: 50px;margin-left: -24px;opacity: .9;vertical-align: top;"><i
            style="font-weight:bold">MAREK FILMS</i></div>
        <div class="col-4">
          <ul style="display: flex;">
            <li onclick="location.reload()">首页</li>
            <li>电影</li>
            <li>剧集</li>
            <li>动漫</li>
            <li>综艺</li>
            <li>专题</li>
            <li>app</li>
          </ul>
        </div>
        <div class="col-6" style="text-align: right;"><input type="text" placeholder="输入影片关键字..." style="height: 25px;"
            id="search"><span style="position: relative;left:-20px;cursor:pointer" data-bs-toggle="modal"
            data-bs-target="#myModal" onclick="searchName()"><svg xmlns="http://www.w3.org/2000/svg" width="16"
              height="16" fill="currentColor" class="bi bi-search" viewBox="0 0 16 16">
              <path
                d="M11.742 10.344a6.5 6.5 0 1 0-1.397 1.398h-.001c.03.04.062.078.098.115l3.85 3.85a1 1 0 0 0 1.415-1.414l-3.85-3.85a1.007 1.007 0 0 0-.115-.1zM12 6.5a5.5 5.5 0 1 1-11 0 5.5 5.5 0 0 1 11 0z" />
            </svg></span>
            <span id="history"><svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor"
              class="bi bi-clock" viewBox="0 0 16 16">
              <path d="M8 3.5a.5.5 0 0 0-1 0V9a.5.5 0 0 0 .252.434l3.5 2a.5.5 0 0 0 .496-.868L8 8.71V3.5z" />
              <path d="M8 16A8 8 0 1 0 8 0a8 8 0 0 0 0 16zm7-8A7 7 0 1 1 1 8a7 7 0 0 1 14 0z" />
            </svg><div id="hide">您还没有观看影片哦!</div>
          </span>
            <button type="button" onclick="quit()" class="btn btn-danger btn-sm"
            style="margin-left:64px">退出<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16"
              fill="currentColor" class="bi bi-power" viewBox="0 0 16 16">
              <path d="M7.5 1v7h1V1h-1z" />
              <path
                d="M3 8.812a4.999 4.999 0 0 1 2.578-4.375l-.485-.874A6 6 0 1 0 11 3.616l-.501.865A5 5 0 1 1 3 8.812z" />
            </svg></button>
        </div>
      </div>
      <div class="row" style="overflow: hidden;margin-left: 0;">
        <div class="swiper">
          <div class="swiper-wrapper">
            <div class="swiper-slide"><img src="../img/01.jpg" alt=""></div>
            <div class="swiper-slide"><img src="../img/02.jpg" alt=""></div>
            <div class="swiper-slide"><img src="../img/03.jpg" alt=""></div>
            <div class="swiper-slide"><img src="../img/04.jpg" alt=""></div>
            <div class="swiper-slide"><img src="../img/05.jpg" alt=""></div>
            <div class="swiper-slide"><img src="../img/06.jpg" alt=""></div>
            <div class="swiper-slide"><img src="../img/07.jpg" alt=""></div>
            <div class="swiper-slide"><img src="../img/08.jpg" alt=""></div>
          </div>
          <!-- 如果需要分页器 -->
          <div class="swiper-pagination"></div>
          <!-- 如果需要导航按钮 -->
          <!-- <div class="swiper-button-prev"></div>
          <div class="swiper-button-next"></div> -->
          <!-- 如果需要滚动条 -->
          <div class="swiper-scrollbar"></div>
        </div>
        <!-- 导航等组件可以放在Swiper容器之外 -->
        <script src="../js/swiper-bundle.min.js"></script>
        <script>
          var mySwiper = new Swiper('.swiper', {
            // direction: 'vertical', // 垂直切换选项
            loop: true, // 循环模式选项
            autoplay: { delay: 2000 },
            effect: "coverflow",
            pagination: {
              el: '.swiper-pagination',
            },

            navigation: {
              nextEl: '.swiper-button-next',
              prevEl: '.swiper-button-prev',
            },
            scrollbar: {
              el: '.swiper-scrollbar',
            },
          })
        </script>
      </div>
      <div class="list" style="display: flex;margin-top: 32px;">
        <ul id="ul1" style="display: flex;border-bottom: 1px solid #999;">
          <li class="active" id="willup"><svg xmlns="http://www.w3.org/2000/svg" width="20" height="20"
              fill="currentColor" class="bi bi-play-btn-fill" viewBox="0 0 16 16">
              <path
                d="M0 12V4a2 2 0 0 1 2-2h12a2 2 0 0 1 2 2v8a2 2 0 0 1-2 2H2a2 2 0 0 1-2-2zm6.79-6.907A.5.5 0 0 0 6 5.5v5a.5.5 0 0 0 .79.407l3.5-2.5a.5.5 0 0 0 0-.814l-3.5-2.5z" />
            </svg> &nbsp;即将上映</li>
          <li>动作片</li>
          <li>喜剧片</li>
          <li>恐怖片</li>
          <li>科幻片</li>
          <li>爱情片</li>
          <li>剧情片</li>
          <li>传记片</li>
          <li>纪录片</li>
          <li>网络片</li>
          <li>其他&gt;</li>
        </ul>
        <span style="color: orange;margin-left:28px"><svg xmlns="http://www.w3.org/2000/svg" width="16" height="16"
            fill="currentColor" class="bi bi-fire" viewBox="0 0 16 16">
            <path
              d="M8 16c3.314 0 6-2 6-5.5 0-1.5-.5-4-2.5-6 .25 1.5-1.25 2-1.25 2C11 4 9 .5 6 0c.357 2 .5 4-2 6-1.25 1-2 2.729-2 4.5C2 14 4.686 16 8 16Zm0-1c-1.657 0-3-1-3-2.75 0-.75.25-2 1.25-3C6.125 10 7 10.5 7 10.5c-.375-1.25.5-3.25 2-3.5-.179 1-.25 2 1 3 .625.5 1 1.364 1 2.25C11 14 9.657 15 8 15Z" />
          </svg> 电影周榜单</span>
      </div>
      <div class="bottom" style="display: flex;">
        <div class="left" style="width: 1095px">
          <ol id="ol1">
            <li class="active li1" id="one">

            </li>

            <li class="li1" id="two">

            </li>

            <li class="li1" id="three">

            </li>
            <li class="li1" id="four">

            </li>
            <li class="li1" id="five">

            </li>
            <li class="li1" id="six">

            </li>
            <li class="li1" id="seven">

            </li>
            <li class="li1" id="eight">

            </li>
            <li class="li1" id="nine">

            </li>
            <li class="li1" id="ten">

            </li>
            <li class="li1" id="eleven">

            </li>
          </ol>
        </div>
        <div class="right">
          <ol style="margin-top: 10px;margin-left: 37px;">
            <li><i style="color: orange;">1 </i> <span>独行月球</span></li>
            <li><i style="color: orange;">2 </i> <span>明日战记</span></li>
            <li><i style="color: orange;">3 </i> <span>猎屠</span></li>
            <li>4 <span>漫长的告白</span></li>
            <li>5 <span>人生大事</span></li>
            <li>6 <span>侏罗纪世界3</span></li>
            <li>7 <span>蜘蛛侠:英雄无归</span></li>
            <li>8 <span>开心超人之英雄的心</span></li>
          </ol>
        </div>
      </div>

      <!-- 模态框 -->
      <div class="modal fade" id="myModal">
        <div class="modal-dialog modal-dialog-scrollable">
          <div class="modal-content">

            <!-- 模态框头部 -->
            <div class="modal-header">
              <h4 class="modal-title"><svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" fill="currentColor"
                  class="bi bi-film" viewBox="0 0 16 16">
                  <path
                    d="M0 1a1 1 0 0 1 1-1h14a1 1 0 0 1 1 1v14a1 1 0 0 1-1 1H1a1 1 0 0 1-1-1V1zm4 0v6h8V1H4zm8 8H4v6h8V9zM1 1v2h2V1H1zm2 3H1v2h2V4zM1 7v2h2V7H1zm2 3H1v2h2v-2zm-2 3v2h2v-2H1zM15 1h-2v2h2V1zm-2 3v2h2V4h-2zm2 3h-2v2h2V7zm-2 3v2h2v-2h-2zm2 3h-2v2h2v-2z" />
                </svg> 相关影片</h4>
              <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
            </div>

            <!-- 模态框内容 -->
            <div class="modal-body" id="details" style="text-align: center;">
              <img src="" alt="">
              <p></p>
              <p></p>
            </div>

            <!-- 模态框底部 -->
            <div class="modal-footer">
              <button type="button" class="btn btn-danger" data-bs-dismiss="modal">关闭</button>
            </div>

          </div>
        </div>
      </div>
    </div>
  </main>
  <script src="../js/homePage.js"></script>
  <script src="../js/usernameRender.js"></script>
  <script src="../js/home.js"></script>
  <script src="../js/quit.js"></script>
  <script src="../js/homeSearch.js"></script>

</body>

</html>